<!-- 
  setup 语法糖时如何声明 name 、 inheritAttrs 等选项
    Vue3.3 之前

      再写一个不设置 setup 属性的 script 标签。

    Vue3.3 之后

      新增了 defineOptions 编译器宏
 -->

<template>
  <div>
    <h4>HelloWorld</h4>

    <p>{{ msg }}</p>
  </div>
</template>

<script setup>
import { ref, useSlots, useAttrs } from 'vue'

defineEmits(['click'])

const slots = useSlots()

const attrs = useAttrs()

console.log('=== slots', slots)
console.log('=== attrs', attrs)

const msg = ref('hello')

// defineOptions({
//   name: 'Abcd',
//   inheritAttrs: false,

//   beforeRouteEnter() {

//   },

//   beforeRouteUpdate() {

//   },

//   data() {
//     return {

//     }
//   }
// })
</script>

<!-- <script>
export default {
  name: 'HelloWorld',

  beforeRouteEnter() {},

  beforeRouteUpdate() {},

  beforeRouteLeave() {}
}
</script> -->
